<template>
    <view>
        <!-- pages/myBalance/myBalance.wxml -->
        <view class="container" :style="isIpx ? 'padding-bottom:168rpx' : 'padding-bottom:120rpx'">
            <!-- 日期搜索 -->
            <view class="search" @tap="goSearch">
                <view class="iconfont icon-date"></view>
                <input type="text" placeholder="开始时间" disabled :value="sdt" />
                <text>至</text>
                <input type="text" placeholder="结束时间" disabled :value="edt" />
            </view>
            <!-- 账户金额 -->
            <!-- <view class="account">
    <view class="item">通用余额:<text>{{userinfo.balance}}</text>元</view>
    <view class="item">赠送余额:<text>{{userinfo.giftBalance}}</text>元</view>
  </view> -->
            <!-- 明细 -->
            <view class="list">
                <view class="title">
                    <view class="border bg-primary"></view>
                    余额使用明细
                </view>
                <block v-if="MainList.length">
                    <view class="item" v-for="(item, index) in MainList" :key="index">
                        <view class="line">
                            <label>门店：</label>
                            <label v-if="item.storeName">{{ item.storeName }}</label>
                        </view>

                        <view class="line">
                            <label>时间：</label>
                            {{ item.createTime }}
                        </view>

                        <view class="line">
                            <label>类型：</label>
                            <block v-if="item.type == 6">管理员清空</block>
                            <block v-if="item.type == 5">管理员赠送</block>
                            <block v-else-if="item.type == 4">订单退款</block>
                            <block v-else-if="item.type == 3">订单支付</block>
                            <block v-else-if="item.type == 2">充值赠送</block>
                            <block v-else-if="item.type == 1">在线充值</block>
                            <block v-else>
                                {{ item.moneyType === 1 ? '账户余额' : '赠送余额' }}
                            </block>
                        </view>

                        <view class="line">
                            <label>备注：</label>
                            {{ item.remark }}
                        </view>

                        <view class="tip">
                            <text v-if="item.moneyType === 1">门店账户余额：{{ item.totalMoney ? item.totalMoney : 0 }}元</text>
                            <text v-else>门店赠送余额：{{ item.totalGiftMoney ? item.totalGiftMoney : 0 }}元</text>
                        </view>

                        <view :class="'total ' + (item.type === 3 ? '' : 'color-primary')">
                            <view class="price">{{ item.type === 3 ? '-' : '+' }}{{ item.money }}元</view>
                            <view>{{ item.moneyType === 1 ? '账户余额' : '赠送余额' }}</view>
                        </view>
                    </view>
                    <!-- <view class="item">
        <view class="line"><label>时间：</label>2023年12月12日 11:31:31</view>
        <view class="line"><label>类型：</label>赠送余额</view>
        <view class="line"><label>备注：</label>充值赠送，充300元，送50元</view>
        <view class="tip">
          <text>账户余额：20元</text>
          <text>赠送余额：20元</text>
        </view>
        <view class="total color-primary">
          <view class="price">+50元</view>
          <view>赠送余额</view>
        </view>
      </view> -->
                    <view class="noteMore" v-if="canLoadMore">上拉查看更多...</view>
                </block>
                <block v-else>
                    <view class="nodata">暂无数据</view>
                </block>
            </view>
            <view :class="'submit ' + (isIpx ? 'fix-iphonex-button' : '')">
                <navigator url="../recharge/recharge" class="btn bg-primary">充值</navigator>
            </view>
            <view class="footer"></view>
        </view>
        <!-- 日期选择弹窗 -->
        <van-calendar :show="show" type="range" @close="onClose" @confirm="onConfirm" :show-confirm="false" allow-same-day :min-date="minDate" />
    </view>
</template>

<script>
// pages/myBalance/myBalance.js
var http = require('../../utils/http');
var util1 = require('../../utils/util.js');
const app = getApp();
export default {
    data() {
        return {
            sdt: '',
            edt: '',
            show: false,
            //日期控件
            minDate: new Date(2023, 0, 1).getTime(),
            userinfo: {},
            //用户信息
            MainList: [],
            //列表数组
            canLoadMore: true,
            //是否还能加载更多
            pageNo: 1,
            is_have: true,
            isIpx: app.globalData.isIpx ? true : false
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad(options) {
        this.getListData('refresh');
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {
        // this.getuserinfo();
    },
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {
        let that = this;
        this.setData({
            pageNo: 1,
            canLoadMore: true,
            MainList: []
        });
        this.getListData('refresh');
        uni.stopPullDownRefresh();
    },
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {
        let that = this;
        if (that.canLoadMore) {
            that.pageNo++;
            this.getListData('');
        } else {
            uni.showToast({
                title: '我是有底线的...'
            });
        }
    },
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {},
    methods: {
        getuserinfo: function () {
            var that = this;
            if (app.globalData.isLogin) {
                http.request(
                    '/member/user/get',
                    '1',
                    'get',
                    {},
                    app.globalData.userDatatoken.accessToken,
                    '',
                    function success(info) {
                        console.info('我的信息===');
                        console.info(info);
                        if (info.code == 0) {
                            that.setData({
                                userinfo: info.data
                            });
                        }
                    },
                    function fail(info) {}
                );
            } else {
                //console.log('未登录失败！')
            }
        },

        //获取列表数据
        getListData: function (e) {
            var that = this;
            let message = '';
            if (app.globalData.isLogin) {
                if (e == 'refresh') {
                    //刷新，page变为1
                    message = '正在加载';
                    that.setData({
                        pageNo: 1
                    });
                }
                http.request(
                    '/member/user/getMoneyBillPage',
                    '1',
                    'post',
                    {
                        pageNo: that.pageNo,
                        pageSize: 10,
                        startTime: that.sdt,
                        endTime: that.edt
                    },
                    app.globalData.userDatatoken.accessToken,
                    message,
                    function success(info) {
                        console.info('返回111===');
                        console.info(info);
                        if (info.code == 0) {
                            if (e == 'refresh') {
                                that.setData({
                                    MainList: info.data.list
                                });
                                if (info.data.list.length === 0) {
                                    that.setData({
                                        canLoadMore: false
                                    });
                                }
                            } else {
                                if (info.data != null && info.data.list.length <= info.data.total) {
                                    that.setData({
                                        canLoadMore: false
                                    });
                                }
                                let arr = that.MainList;
                                let arrs = arr.concat(info.data.list);
                                that.setData({
                                    MainList: arrs
                                });
                            }
                        } else {
                            uni.showModal({
                                content: '请求服务异常，请稍后重试',
                                showCancel: false
                            });
                        }
                    },
                    function fail(info) {}
                );
            } else {
                uni.showModal({
                    content: '请您先登录，再重试！',
                    showCancel: false
                });
            }
        },

        goSearch() {
            this.setData({
                show: true
            });
        },

        onClose() {
            this.setData({
                show: false
            });
        },

        formatDate(date) {
            date = new Date(date);
            return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
        },

        onConfirm(event) {
            const [start, end] = event.detail;
            this.setData({
                show: false,
                sdt: this.formatDate(start),
                edt: this.formatDate(end),
                pageNo: 1
            });
            this.getListData('refresh');
        }
    }
};
</script>
<style>
@import './myBalance.css';
</style>
